<template>
  <div class="my" >
    <div class="top">
      <p>常用工具</p>
     <van-tabbar v-model="active">
  <van-tabbar-item icon="location-o" @click="tiaodizhi()">我的地址</van-tabbar-item>
  <van-tabbar-item icon="service-o">我的客服</van-tabbar-item>
  <van-tabbar-item icon="shop-collect-o" @click="tiaoshoucang()">店铺关注</van-tabbar-item>
  <van-tabbar-item icon="comment-o">评价有理</van-tabbar-item>
</van-tabbar>

<!-- <div class="topone">
  <div class="dizhi" @click="tiaodizhi()">我的地址</div>
  <div class="kefu">我的客服</div>
    <div class="shoucang" @click="tiaoshoucang()">店铺关注</div> 
  <div class="pingjia">评价有理</div>

</div> -->

    </div>


     <Tabbar></Tabbar>
  </div>
</template>

<script> 
export default {
  data(){
  return{
    active:0
  }
},
  methods:{
    tiaoshoucang(){
       this.$router.push('/mysc');
    },
    tiaodizhi(){
      this.$router.push('/dizhi');
    }

  }
}
</script>

<style lang="scss" >
.my{
  background-color: #eee;
  padding: 0 10px;
  height: 600px;
 position: relative;
  flex: 1;
  .top{
    
    transform: translateY(100px);
    
    height:70px;
    background-color: white;
    border-radius: 5px;
   
    
   
    padding: 10px;
    p{
      font-weight: 700;
    }
  }
.topone{
      display: flex;
      justify-content: space-around;
}
}
</style>